<template>
	<view :style="$store.state.skin">
		<view class="headTop">
			<view class="hleft">
				<view class="top">
			   {{infoData.last_px}}
				</view>
				<view class="bot" style="font-size: 24rpx;">
					<view class="left">
						{{infoData.px_change_rate}}%
					</view>
					<view class="right">
						{{infoData.px_change}}
					</view>
				</view>
			</view>
			<view class="hright">
				<view class="top">
					<view class="item">
						<view class="ileft">
							今开
						</view>
						<view class="right" :style="'color:'+(infoData.open_px >=infoData.last_px?'red;':'#2bdc70;')">
							{{infoData.open_px}}
						</view>
					</view>
					<view class="item">
						<view class="ileft">
							最高
						</view>
						<view class="right" :style="'color:'+(infoData.high_px >=infoData.last_px?'red;':'#2bdc70;')">
						{{infoData.high_px}}
						</view>
					</view>
					<view class="item">
						<view class="ileft">
							最低
						</view>
						<view class="right" :style="'color:'+(infoData.low_px >=infoData.last_px?'red;':'#2bdc70;')">
						{{infoData.low_px}}
						</view>
					</view>
				</view>
				<view class="top ttop">
					<view class="item">
						<view class="ileft">
							昨收
						</view>
						<view class="right">
								{{infoData.preclose_px}}
						</view>
					</view>
					<view class="item">
						<view class="ileft">
							总手
						</view>
						<view class="right">
								{{infoData.trading_volume}}
						</view>
					</view>
					<view class="item">
						<view class="ileft">
							金额
						</view>
						<view class="right">
								{{infoData.turnover}}
						</view>
					</view>
				</view>
			</view>
		</view>


		<view class="headNav">
			<view class="item" @click="navChange(index)" v-for="(item,index) in navList" :key='index'>
				<text class="name" :class="{'names':navIndex == index}">{{item}}</text>
				<text class="heng" v-if="navIndex == index"></text>
			</view>
		</view>
		<view class="content">
			<view class="left">
				<div v-show="navIndex == 0" style="position: relative; user-select: none; " class="chartlist"
					id="fenshi"></div>
				<div  v-show="navIndex == 1" style="position: relative; user-select: none; " class="chartlist" id="rik"></div>
				<div v-show="navIndex == 2" style="position: relative; user-select: none; " class="chartlist" id="zhouk"></div>
				<div v-show="navIndex ==3" style="position: relative; user-select: none; " class="chartlist" id="yuek"></div>
			</view>
			<view class="right">
				<view class="title">
					分时成交
				</view>
				<scroll-view scroll-y="true" style="height: 80vh;">
					<view class="item"  v-for="(item,index) in lista" :key='index'>
						<view class="ileft">
					      {{item.time}}
						</view>
						<view class="iright">
							{{item.num}}
						</view>
						<view class="iright">
							{{item.monney}}
						</view>
					</view>
					<view style="height: 200rpx;">
						
					</view>
				</scroll-view>
			<!-- 	<view class="item" v-for="(item,index) in dealCode" :key='index'>
					<view class="ileft">
					卖{{item}}
					</view>
					<view class="iright">
						47.31
					</view>
					<view class="iright">
						47
					</view>
				</view> -->
			</view>
		</view>

		<view class="btnBox">
			<view class="btn btnz" @click='addZixuan()'>
			     {{'自选'}}
			</view>
			<view class="btn" @click="toTrade">
				交易
			</view>
		</view>
		<view :prop="msg" :change:prop="test.onChange" id="renderjs-view"></view>
	</view>
</template>
<script>
	import request from "@/api/request.js"
	export default {
		data() {
			return {
				infoData:{},
				dealCode:[1,2,3,4,5],
				msg: 0,
				navList: [
					'分时',
					'日K',
					'周K',
					'月K',
				],
				lista:[],
				navIndex: 0,
				code: 'sz000977',
				isActive : 0, // 买入需要的参数
			}
		},
		onShow() {
			// 设置导航栏颜色
			uni.setNavigationBarColor({
				frontColor: '#ffffff',
				backgroundColor: this.$store.state.presentColor
			});
		},
		onLoad(opt) {
			console.log(opt)
            this.code =  opt.code;
			if(opt.isActive){
				this.isActive = opt.isActive;
			}
			this.getInfo2();
			this.getInfo1();
			if(uni.getStorageSync('userData')){
				// this.getZixuan();
			}

		},
		methods: {
			zixuanText(){
				let txt = '添加自选'
				 this.zixuanList.forEach((item,index)=>{
					 if(item.code == this.code){
						  txt = '取消自选'
					 }
				 })
				 
				 return txt;
			},
			
			addZixuan(txt){
				if(true){
					request.post('/api/marketlist/addSelect',{
						all_no:this.code,
					}).then(res=>{
						this.zixuanList = res.data;
						uni.showToast({
							title:'添加自选成功'
						})
						// this.getZixuan();
					})
				}else{
					
					// request.post('/api/marketlist/delSelect',{
					// 	id:this.code,
					// 	userId:uni.getStorageSync('userData').user_id,
					// }).then(res=>{
					// 	this.zixuanList = res.data;
						uni.showToast({
							title:'已添加自选'
						})
					// 	this.getZixuan();
					// })
				}
				
			},
			// 交易点击
			toTrade(){
				
				if(!uni.getStorageSync('userData').token){
					uni.showModal({
					title:'提示',
					content:'请先登录',
					success: (res) => {
						if(res.confirm){
							uni.navigateTo({
								url:'/pages/login/login'
							})
							
							return
						}
						
						
					}
					})
					return
				}
				let data = {
					szid : this.code,
					id :this.isActive
				};
				uni.navigateTo({
					url: `/pages/trade/trading?data=${JSON.stringify(data)}`,
				});
			},
			getZixuan(){
				request.get('/api/marketlist/optional',{
				}).then(res=>{
					this.zixuanList = res.data;
				})
			},
			getInfo2(){
	
				uni.request({
					url:'https://web.ifzq.gtimg.cn/appstock/app/minute/query?code='+this.code,
					success: (res) => {
						// this.lista= res.data.data[this.code].data.data;
						let lista=[];
						 res.data.data[this.code].data.data.forEach((item,index)=>{
							 let a =  item.split(' ');
							//  let  turnover = Number(a[3]);
							 
							// if(turnover > 10000){
							// 								turnover = (turnover / 10000).toFixed(2)+'万'
							// }else if(turnover > 10000){
							// 	turnover = (turnover / 10000).toFixed(2)+'万'
							//  }else{
								 
							//  }
						
							 lista.push({
								 time:a[0].substr(0,2)+':'+a[0].substr(2),
								 num:a[1],
								 monney:a[2],
							 })
						 })
						 this.lista = lista.reverse()
						uni.request({
							url:`https://web.ifzq.gtimg.cn/appstock/app/kline/kline?param=${this.code},day,,,60,`,
							success: (ress) => {
								uni.request({
									// month
									url:`https://web.ifzq.gtimg.cn/appstock/app/kline/kline?param=${this.code},week,,,60,`,
									success: (resss) => {
									uni.request({
										url:`https://web.ifzq.gtimg.cn/appstock/app/kline/kline?param=${this.code},month,,,60,`,
										success: (ressss) => {
											this.msg = {
												fenshiList: res.data.data[this.code].data.data,
												rikList:ress.data.data[this.code].day,
												zhoukList:resss.data.data[this.code].week,
												yuekList:ressss.data.data[this.code].month,
											}
										}
									})
									}
								})
							}
						})
					
					}
				})
				
				
			},
			getInfo1() {
				let mul = (a, b) => {
					let c = 0,
						d = a.toString(),
						e = b.toString()
					try {
						c += d.split('.')[1].length
					} catch (f) {}
					try {
						c += e.split('.')[1].length
					} catch (f) {}
					return (Number(d.replace('.', '')) * Number(e.replace('.', ''))) / Math.pow(10, c)
				}
				let div = (a, b) => {
					let c,
						d,
						e = 0,
						f = 0
					try {
						e = a.toString().split('.')[1].length
					} catch (g) {}
					try {
						f = b.toString().split('.')[1].length
					} catch (g) {}
					return (
						(c = Number(a.toString().replace('.', ''))),
						(d = Number(b.toString().replace('.', ''))),
						mul(c / d, Math.pow(10, f - e))
					)
				}
				
			
				uni.request({
					url: 'https://qt.gtimg.cn?q=' + this.code, //仅为示例，并非真实接口地址。
					success: (res) => {
					
						const stockData = res.data.split(';')
						const parsedData = [];
						stockData.forEach(data => {
							const fields = data.split('~')
							if (fields[1]) {
								const name = fields[1]
								uni.setNavigationBarTitle({
									title: name
								});
								const code = fields[2]
								const last_px = fields[3]
								const open_px = fields[5]
								const preclose_px = fields[4]
								const high_px = fields[33]
								const low_px = fields[34]
								const px_change = fields[31]
								const px_change_rate = fields[32]
								const amplitude = fields[43]
								let trading_volume = parseFloat(fields[6])
								let turnover = parseFloat(fields[37])
								let inner_disc = parseFloat(fields[8])
								let outside_disc = parseFloat(fields[7])
								if (trading_volume >= 1e8) {
									trading_volume = div(trading_volume, 1e8).toFixed(2) + '亿'
								} else {
									trading_volume = div(trading_volume, 1e4).toFixed(2) + '万'
								}
								if (turnover >= 1e4) {
									turnover = div(turnover, 1e4).toFixed(2) + '亿'
								} else {
									turnover = turnover + '万'
								}
								if (inner_disc >= 1e8) {
									inner_disc = div(inner_disc, 1e8).toFixed(2) + '亿'
								} else {
									inner_disc = div(inner_disc, 1e4).toFixed(2) + '万'
								}
								if (outside_disc >= 1e8) {
									outside_disc = div(outside_disc, 1e8).toFixed(2) + '亿'
								} else {
									outside_disc = div(outside_disc, 1e4).toFixed(2) + '万'
								}

								const market_value = fields[45]
								const PE_ratio = fields[39]
								const floating_market_value = fields[44]

								const sell_px = fields[19]
								parsedData.push({
									name,
									code,
									last_px,
									open_px,
									preclose_px,
									high_px,
									low_px,
									px_change,
									px_change_rate,
									amplitude,
									trading_volume,
									turnover,
									inner_disc,
									outside_disc,
									market_value,
									PE_ratio,
									floating_market_value,
						   sell_px
						  })
							}
						})
						// return parsedData
						this.infoData = parsedData[0]
					}
				});
			},
			navChange(e) {
				this.navIndex = e;
			},
		},
	}
</script>
<script module="test" lang="renderjs">
	import Highcharts from 'highcharts/highstock';
	export default {
		data() {
			return {
			
			}
		},
		methods: {
			onChange(newValue, oldValue, ownerInstance, instance) {
				if(newValue.fenshiList){
					let list  = [];
					var  time = (new Date()).getTime(), i;
					newValue.fenshiList.forEach((item,index)=>{
						let a = item.split(' ');
						let b  = Number(a[0].substr(0,2))*60*60*1000
					 b  += Number(a[0].substr(2))*60*1000
					     // 165610800	
					 // b+= Number(new Date())
						list.push([new Date(new Date().setHours(0, 0, 0, 0)).getTime()+b,Number(a[1])]);
						// item.split(' ');
					})
					this.fenshiFn(list)
					this.riKFn(newValue.rikList)
					this.zhoukFn(newValue.zhoukList)
					this.yuekFn(newValue.yuekList)
				}
				

			},
			fenshiFn(list){
				let
					chart_data_list =list;
				Highcharts.stockChart('fenshi', {
				xAxis: {
					labels: {
						formatter: function() {
							
							function shijianc(time) {
							      let date = new Date(time)
							      let Y = date.getFullYear() + '-'
							      let M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'
							      let D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' '
							      let h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':'
							      let m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes())
							      let s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds())
							      // return Y + M + D + h + m + s
								  return h + m 
							    }
							return  shijianc( this.value);
						},
						
					},
				},
					rangeSelector: {
						buttons: [],
						selected: 1,
						inputEnabled: false
					},
					exporting: {
						enabled: false
					},
					tooltip: {
					
						formatter: function() {
							function shijianc(time) {
							      let date = new Date(time)
							      let Y = date.getFullYear() + '-'
							      let M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'
							      let D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' '
							      let h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':'
							      let m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes())
							      let s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds())
							      return Y + M + D + h + m 
							    }
							return '<span style="color:' + this.point.color + '">\u25CF</span> <b>' + shijianc(this.x) + '</b><br/>' +
								'价格:' + this.y + '<br/>' 
								
						},
						split: false,
					},
					series: [{
						name: '价格',
						type: 'area',
						data: chart_data_list,
						// gapSize: 5,
						// tooltip: {
						// 	valueDecimals: 2
						// },
						fillColor: {
							linearGradient: {
								x1: 0,
								y1: 0,
								x2: 0,
								y2: 1
							},
							stops: [
								// [1, 'rgba(56,179,254,0.2)'],
								// [100, 'rgba(0,192,0,0.2)'],
				
							]
						},
						threshold: null
					}]
				});
							
							
							
			},
		yuekFn(e) {
			
			let list = [];
			
			e.forEach((item,index)=>{
				let t =  Date.parse(new Date(item[0]))
				list.push([t,Number(item[2]),Number(item[3]),Number(item[4]),Number(item[1])])
			})
			
			let that = this;
			Highcharts.stockChart('yuek', {
				xAxis: {
					labels: {
						formatter: function(e) {
							function shijianc(time) {
							      let date = new Date(time)
							      let Y = date.getFullYear() + '-'
							      let M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'
							      let D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' '
							      let h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':'
							      let m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes())
							      let s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds())
							      // return Y + M + D + h + m 
								   return `<span style='font-size:10px;'>${   Y + M + D }</span>`
							    }
								
							return shijianc(this.pos);
						}
					},
				},
				exporting: {
					enabled: false
				},
		
				rangeSelector: {
					buttons: [],
					selected: 1,
					inputEnabled: false
				},
		
				series: [{
					type: 'candlestick',
					name: '',
					data: list,
					color: 'green',
					lineColor: 'green',
		
					upColor: 'red',
					upLineColor: 'red',
					navigatorOptions: {
						color: Highcharts.getOptions().colors[0]
					}
				}],
				tooltip: {
				
					formatter: function() {
						
						function shijianc(time) {
						      let date = new Date(time)
						      let Y = date.getFullYear() + '-'
						      let M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'
						      let D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' '
						      let h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':'
						      let m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes())
						      let s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds())
						      // return Y + M + D + h + m 
							   return `<span style='font-size:12px;'>${   Y + M + D }</span>`
						    }
							
						return '<span style="color:' + this.point.color + '">\u25CF</span> <b>' +shijianc(this.x)+ '</b><br/>' +
							'开盘:' + this.point.open + '<br/>' +
							'最高:' + this.point.high + '<br/>' +
							'最低:' + this.point.low + '<br/>' +
							'收盘:' + this.point.close + '<br/>'
					},
					split: false,
				},
				plotOptions: {
					series: {
						pointStart: Date.UTC(2012, 0, 1),
						pointInterval: 24 * 3600 * 1000
					}
				},
			});
		},
		
		
			zhoukFn(e) {
				
				let list = [];
				
				e.forEach((item,index)=>{
					let t =  Date.parse(new Date(item[0]))
					list.push([t,Number(item[2]),Number(item[3]),Number(item[4]),Number(item[1])])
				})
				
				let that = this;
				Highcharts.stockChart('zhouk', {
					xAxis: {
						labels: {
							formatter: function(e) {
								function shijianc(time) {
								      let date = new Date(time)
								      let Y = date.getFullYear() + '-'
								      let M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'
								      let D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' '
								      let h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':'
								      let m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes())
								      let s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds())
								      // return Y + M + D + h + m 
									   return `<span style='font-size:10px;'>${   Y + M + D }</span>`
								    }
									
								return shijianc(this.pos);
							}
						},
					},
					exporting: {
						enabled: false
					},
			
					rangeSelector: {
						buttons: [],
						selected: 1,
						inputEnabled: false
					},
					// plotOptions: {
					// 	candlestick: {
					// 		tooltip: {
					// 			pointFormat: '<span style="color:{point.color}">\u25CF</span> <b> {series.name}</b><br/>' +
					// 			'开盘: {point.open}<br/>' +
					// 			'最高: {point.high}<br/>' +
					// 			'最低: {point.low}<br/>' +
					// 			'收盘: {point.close}<br/>',
					// 		xDateFormat: '%Y-%m-%d',
					// 		shared: true,
					// 		split:false,
			
					// 		}
					// 	}
					// },
					series: [{
						type: 'candlestick',
						name: '',
						data: list,
						color: 'green',
						lineColor: 'green',
			
						upColor: 'red',
						upLineColor: 'red',
						navigatorOptions: {
							color: Highcharts.getOptions().colors[0]
						}
					}],
					tooltip: {
					
						formatter: function() {
							
							function shijianc(time) {
							      let date = new Date(time)
							      let Y = date.getFullYear() + '-'
							      let M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'
							      let D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' '
							      let h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':'
							      let m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes())
							      let s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds())
							      // return Y + M + D + h + m 
								   return `<span style='font-size:12px;'>${   Y + M + D }</span>`
							    }
								
							return '<span style="color:' + this.point.color + '">\u25CF</span> <b>' +shijianc(this.x)+ '</b><br/>' +
								'开盘:' + this.point.open + '<br/>' +
								'最高:' + this.point.high + '<br/>' +
								'最低:' + this.point.low + '<br/>' +
								'收盘:' + this.point.close + '<br/>'
						},
						split: false,
					},
					plotOptions: {
						series: {
							pointStart: Date.UTC(2012, 0, 1),
							pointInterval: 24 * 3600 * 1000
						}
					},
				});
			},

			riKFn(e) {
					let list = [];
		
				e.forEach((item,index)=>{
					let t =  Date.parse(new Date(item[0]))
					list.push([t,Number(item[2]),Number(item[3]),Number(item[4]),Number(item[1])])
				})
				
				let that = this;
				Highcharts.stockChart('rik', {
					xAxis: {
						labels: {
							formatter: function(e) {
								function shijianc(time) {
								      let date = new Date(time)
								      let Y = date.getFullYear() + '-'
								      let M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'
								      let D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' '
								      let h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':'
								      let m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes())
								      let s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds())
								      // return Y + M + D + h + m 
									   return `<span style='font-size:10px;'>${   Y + M + D }</span>`
								    }
									
								return shijianc(this.pos);
							}
						},
					},
					exporting: {
						enabled: false
					},

					rangeSelector: {
						buttons: [],
						selected: 1,
						inputEnabled: false
					},
					// plotOptions: {
					// 	candlestick: {
					// 		tooltip: {
					// 			pointFormat: '<span style="color:{point.color}">\u25CF</span> <b> {series.name}</b><br/>' +
					// 			'开盘: {point.open}<br/>' +
					// 			'最高: {point.high}<br/>' +
					// 			'最低: {point.low}<br/>' +
					// 			'收盘: {point.close}<br/>',
					// 		xDateFormat: '%Y-%m-%d',
					// 		shared: true,
					// 		split:false,

					// 		}
					// 	}
					// },
					series: [{
						type: 'candlestick',
						name: '',
						data: list,
						color: 'green',
						lineColor: 'green',

						upColor: 'red',
						upLineColor: 'red',
						navigatorOptions: {
							color: Highcharts.getOptions().colors[0]
						}
					}],
					tooltip: {
					
						formatter: function() {
							
							function shijianc(time) {
							      let date = new Date(time)
							      let Y = date.getFullYear() + '-'
							      let M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'
							      let D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' '
							      let h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':'
							      let m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes())
							      let s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds())
							      // return Y + M + D + h + m 
								   return `<span style='font-size:12px;'>${   Y + M + D }</span>`
							    }
								
							return '<span style="color:' + this.point.color + '">\u25CF</span> <b>' +shijianc(this.x)+ '</b><br/>' +
								'开盘:' + this.point.open + '<br/>' +
								'最高:' + this.point.high + '<br/>' +
								'最低:' + this.point.low + '<br/>' +
								'收盘:' + this.point.close + '<br/>'
						},
						split: false,
					},
					plotOptions: {
						series: {
							pointStart: Date.UTC(2012, 0, 1),
							pointInterval: 24 * 3600 * 1000
						}
					},
				});
			},

		},

		mounted() {



			setTimeout(() => {
				Highcharts.setOptions({
					lang: {
						contextButtonTitle: "图表导出菜单", //*导出图标按钮的提示信息*／  
						decimalPoint: ".", //小数点号，例如 18.23
						downloadJPEG: "下载JPEG图片",
						downloadPDF: "下载PDF文件",
						downloadPNG: "下载PNG文件",
						downloadSVG: "下载SVG文件",
						drillUpText: "返回 {series.name}", //*下钻功能返回按钮的提示信息*／
						loading: "加载中",
						months: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月",
							"十二月"
						], //月份显示
						noData: "没有数据",
						numericSymbols: ["K", "M", "G", "T", "P",
							"E"
						], // 公制前缀，通过设置为 null 不显示 20k，1.5M 这种形式
						printChart: "打印图表",
						resetZoom: "恢复缩放",
						resetZoomTitle: "恢复图表",
						shortMonths: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct",
							"Nov", "Dec"
						], //短字符显示英文月份
						thousandsSep: ",", //千分号，例如 25,600
						weekdays: ["星期一", "星期二", "星期三", "星期四", "星期五", "星期六", "星期天"] //星期显示
					}
				});
		
			}, 2000)
		}
	}
</script>
<style lang="scss">
	.btnBox {
		display: flex;
		background-color: #fff;
		padding: 20rpx;
		justify-content: space-between;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;

		.btn {
			width: 49%;
			height: 70rpx;
			background-color: var(--nav-bg);
			display: flex;
			align-items: center;
			justify-content: center;
			color: #fff;
			border-radius: 6rpx;

		}

		.btnz {
			background-color: #ff9b1b;
		}
	}

	.content {
		display: flex;
		background-color: #fff;

		.left {
			width: 60%;
		}

		.right {
			font-size: 24rpx;
			width: 40%;

			.title {
				margin-top: 20rpx;
				color: #999;
				text-align: center;
			}

			.item {
				display: flex;
				justify-content: space-between;
				padding: 20rpx;
				padding-bottom: 0;

.ileft{
	margin-right: 4rpx;
}
				.iright {
					color: var(--nav-bg);
					flex: 1;
					text-align: right;
				}
			}
		}
	}

	.headNav {
		margin-top: 20rpx;
		display: flex;
		justify-content: space-between;
		border-bottom: 1px solid #ccc;
		background-color: #fff;
		padding-top: 20rpx;
		color: #666;

		.item {
			flex: 1;
			text-align: center;
			height: 70rpx;
			position: relative;

			.names {
				color: var(--nav-bg);
			}

			.heng {
				display: flex;
				position: absolute;
				width: 40rpx;
				height: 10rpx;
				// color: red;
				background-color: var(--nav-bg);
				border-radius: 5rpx;
				// margin-right: 50%;
				left: 50%;
				margin-left: -20rpx;
				bottom: 0;

			}
		}
	}

	.headTop {
		display: flex;
		padding: 20rpx;
		height: 100rpx;
		background-color: #f6f6f6;

		.hleft {
			width: 20%;
			display: flex;
			height: 100%;
			justify-content: space-between;
			flex-direction: column;
			margin-right: 30rpx;

			.top {
				color: red;
				font-size: 40rpx;
			}

			.bot {
				display: flex;
				font-display: 24rpx;
				color: red;
				justify-content: space-between;
			}
		}

		.hright {
			flex: 1;
			display: flex;
			flex-direction: column;
			justify-content: space-between;

			.top {
				display: flex;

				// margin-top: 36rpx;
				.item {
					width: 33%;
					display: flex;
					font-size: 24rpx;
					justify-content: space-between;
					// margin-right: 30rpx;
					margin-bottom: 20rpx;

					.ileft {
						color: #999;
						
					}

					.right {
						flex: 1;
						padding-right: 10rpx;
						text-align: right;
						font-size: 24rpx;
						color: red;
					}
				}
			}

			.ttop {
				.item {
					.right {
						color: #000;
					}
				}
			}
		}
	}
</style>
